<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" >
    <title>疫情监控</title>
    <script type="text/javascript" src="static/js/echarts.min.js"></script>
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <link rel="stylesheet" href="../static/css/global.css" >
    <link rel="stylesheet" href="../static/css/main.css" type="text/css">
    <script type="text/javascript" src="../static/js/roll.js"></script>
    <script type="text/javascript" src="https://assets.pyecharts.org/assets/maps/china.js"></script>
</head>
<body>



<div id="title">全国疫情追踪</div>
    <div id="time"></div>

     <div id="l1">左一</div>
     <script type="text/javascript">
         var myChart = echarts.init(document.getElementById('l1'));
         myChart.setOption({{ bar_data| safe }})
    </script>
     <div id="l2">左2</div>
<script>
       var myChart1 = echarts.init(document.getElementById('l2'));
    // 使用刚指定的配置项和数据显示图表。
       myChart1.setOption({{ line_data | safe }});
</script>

     <div id="c1">
         <div class="num" ><h2>123</h2></div>
         <div class="num"><h2>123</h2></div>
         <div class="num"><h2>123</h2></div>
         <div class="num"><h2>123</h2></div>
         <div class="text"><h3>累计确诊</h3></div>
         <div class="text"><h3>累计死亡</h3></div>
         <div class="text"><h3>目前确诊</h3></div>
         <div class="text"><h3>当前无症状</h3></div>
     </div>
     <div id="c2"></div>
     <script>
              var myChart2 = echarts.init(document.getElementById('c2'));
    // 使用刚指定的配置项和数据显示图表。
       myChart2.setOption({{ map_data| safe }});
     </script>
     <div id="r1">右1</div>
     <script>
              var myChart3 = echarts.init(document.getElementById('r1'));
    // 使用刚指定的配置项和数据显示图表。
       myChart3.setOption({{ pie_data| safe }});
     </script>
     <div id="r2">
         <div class="title" >fagg</div>

        <div class="ts"></div>

        <div id="risk_wrapper">
            <div id="risk_wrapper_li1">
                <ul>
                </ul>
            </div>
            <div id="risk_wrapper_li2"></div>
        </div>
     </div>



<script>
     function get_count(){
         $.ajax({
             url:"/r22",
             success:function (data){
                 var account1=data.account1
                 var account2=data.account2
                 console.log(account1,account2)
                 $("#r2 .title").html("高风险地区："+account1+"\t"+"中风险地区："+account2)
             },
             error:function(xhr, type, errorThrown) {
		}

         })
     }
    function get_r2_data() {
    $.ajax({
        url:"/r2",
        dataType:'json',
        success: function(data) {
            var update_time = data.update_time
            var details = data.details
            var risk = data.risk
             $("#r2 .ts").html("截至时间：" + update_time)
            var s =""
            for(var i in details){
                if (risk[i] == "高风险"){
                     s += "<li><span class='high_risk'>高风险\t\t</span>"+ details[i] + "</li>"
                }else{
                     s += "<li><span class='middle_risk'>中风险\t\t</span>"+ details[i] + "</li>"
                }
            }
             $("#risk_wrapper_li1 ul").html(s)
            start_roll()
		},
		error: function(xhr, type, errorThrown) {
		}
    })
}
    function gettime(){
        $.ajax({
            url:"/time",
            timeout:10000,
            success:function (data){
                $("#time").html(data)
            },
            error:function (xhr,type,errorThrown){

            }
        })

    }
     function getshuju(){
        $.ajax({
            url:"/shuju",
            timeout:10000,
            success:function (data){
                $(".num h2").eq(0).text(data.confirm)
                $(".num h2").eq(1).text(data.dead)
                $(".num h2").eq(2).text(data.heal)
                $(".num h2").eq(3).text(data.wzz)
            },
            error:function (xhr,type,errorThrown){

            }
        })

    }
    setInterval(gettime,1000)
    setInterval(getshuju,1000)
    get_r2_data()
     get_count()
         function myrefresh()
{
   window.location.reload();
}
setTimeout('myrefresh()',24*60*60*1000);
</script>
</body>
</html>
